﻿<!DOCTYPE html>
<html lang="en">
<head>
    <title>首页</title>
    <meta charset="utf-8" />
    <meta name="keywords" content="民情系统，绍兴民情" />
    <meta name="description" content="绍兴民情系统" />
    <meta name="viewport" content="width=device-width,initial-scale=1.0" />
    <link rel="icon" href="#" />
    <!--    <link href="style/layout.css" rel="stylesheet" />-->
    <link href="style/bootstrap.min.css" rel="stylesheet" />
    <link href="style/style.css" rel="stylesheet" />
    <link href="style/bootstrap-responsive.min.css" rel="stylesheet" />
    <script src="js/jquery-1.9.1.min.js"></script>
    <script src="js/bootstrap.min.js"></script>

    <!--[if lt IE 9]>
        <script src="script/html5-js.js"></script>
        <script src="script/IE9.js" ></script>
    <![endif]-->
    <!--[if  IE 6]>
        <script src="script/DD_belatedPNG.js"></script>
        <script>
            $(function(){
                DD_belatedPNG.fix(".png");
            });
        </script>
    <![endif]-->
</head>

<body>

    <nav class="navbar navbar-inverse">
        <div class="navbar-inner">
            <div class="container">
                <div class="nav-collapse">
                    <ul class="nav-pills nav">
                        <li class="active"><a href="#">Home</a></li>
                        <li><a href="#about">About</a></li>
                        <li class="dropdown">
                            <a href="#contact" class="dropdown-toggle" data-toggle="dropdown">Contact</a>

                            <ul class="dropdown-menu" role="menu" aria-labelledby="dropdownMenu">
                                <li><a href="#" tabindex="-1">Action</a> </li>
                                <li><a href="#" tabindex="-1">Action</a> </li>
                                <li><a href="#" tabindex="-1">Action</a> </li>
                                <li><a href="#" tabindex="-1">Action</a> </li>
                                <li class="divider"></li>
                                <li><a href="#" tabindex="-1">Action</a> </li>
                                <li class="disabled"><a href="#" tabindex="-1">Action</a> </li>
                                <li class="dropdown-submenu"><a href="#" tabindex="-1">Action</a>
                                    <ul class="dropdown-menu  pull-right">
                                        <li><a href="#" tabindex="-1">Second level link</a></li>
                                        <li><a href="#" tabindex="-1">Second level link</a></li>
                                        <li><a href="#" tabindex="-1">Second level link</a></li>
                                        <li><a href="#" tabindex="-1">Second level link</a></li>
                                        <li><a href="#" tabindex="-1">Second level link</a></li>
                                    </ul>
                                </li>
                            </ul>
                        </li>
                    </ul>
                </div>
            </div>
        </div>
    </nav>

    <div class="container text-left">

        <div class="btn-group">
            <button class="btn-danger btn">left</button>
            <button class="btn-primary btn">left</button>
            <button class="btn-success btn">left</button>
        </div>

        <div class="btn-group-vertical">
            <div class="btn-group">
                <button class="btn">1</button>
                <button class="btn">1</button>
                <button class="btn">1</button>
                <button class="btn">1</button>

            </div>
        </div>


        <div class="btn-group">
            <a href="cardeList.html" class="btn dropdown-toggle btn-primary" data-toggle="dropdown">Action
                <span class="caret"></span>
            </a>
            <ul class="dropdown-menu">
                <li><a href="#">1</a></li>
                <li><a href="#">1</a></li>
                <li><a href="#">1</a></li>
                <li><a href="#">1</a></li>

            </ul>
        </div>

        <!--基本样式表-->
        <div class="h-group">
            <h1>这是H1</h1>
            <h2>这是H1</h2>
            <h3>这是H1</h3>
            <h4>这是H1</h4>
            <h5>这是H1</h5>
            <h6>这是H1</h6>
        </div>

        <p class="lead text-left">Nullam quis risus eget urna mollis ornare vel eu leo. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Nullam id dolor id nibh ultricies vehicula.</p>
        <p class="text-center">Nullam quis risus eget <strong>urna mollis ornare vel eu leo. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. </strong>Nullam id dolor id nibh ultricies vehicula.</p>
        <p class="text-right">Nullam quis risus <small>eget urna mollis ornare vel eu leo. Cum sociis</small> natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Nullam id dolor id nibh ultricies vehicula.</p>

        <p class="muted">FUSCE DAPIBUS,TELLUS,muted,muted</p>
        <p class="text-warning">warning,warning,warning橙色</p>
        <p class="text-error">error,text-error,text-orrer红色</p>
        <address>
            <p class="text-info">text-info,text-info蓝色</p>
        </address>
        <p class="text-success">text-success,text-success,<abbr class="initialism" title="attr">text-success绿色</abbr></p>

        <address class="text-left">
            <strong>Twitter, Inc.</strong><br>
            795 Folsom Ave, Suite 600<br>
            San Francisco, CA 94107<br>
            <abbr title="Phone">P:</abbr>
            (123) 456-7890
        </address>


        <address>
            <strong>FULL name</strong>
            <a href="mailto:#">first.last@example.com</a>
        </address>


        <blockquote>
            <p>lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer posuere erat a ante.</p>
            <small>someone famous<cite title="Source Title">Source TITLE</cite></small>
        </blockquote>


        <blockquote class="pull-right">
            <p>这里显示内容，这里显示内容，这里显示内容</p>
            <small>这里是小蚊子内容!</small>
        </blockquote>


        <ul class="unstyled inline">
            <li>lorem ipsum li li ,li </li>
            <li>lorem ipsum li li ,li </li>
            <li>lorem ipsum li li ,li </li>
            <li>lorem ipsum li li ,li </li>
            <li>lorem ipsum li li ,li </li>
            <li>lorem ipsum li li ,li 
                <ul class="hide">
                    <li>lorem ipsum li li ,li </li>
                    <li>lorem ipsum li li ,li </li>
                    <li>lorem ipsum li li ,li </li>
                    <li>lorem ipsum li li ,li </li>
                    <li>lorem ipsum li li ,li </li>
                </ul>
            </li>
        </ul>

        <ol class="unstyled">
            <li>星星的日子</li>
            <li>星星的日子</li>
            <li>关了门，锁了窗，熄了灯</li>
            <li>关了门，锁了窗，熄了灯</li>
            <li>关了门，锁了窗，熄了灯</li>
            <li>关了门，锁了窗，熄了灯</li>
        </ol>


        <dl class="dl-horizontal">
            <dt>Description lists</dt>
            <dd>a description list is perfect for defining terms.</dd>
            <dt>z这里是DT的头部内容，哈哈哈</dt>
            <dd>vestibulum id ligula porta felis euismod semper eget iacinia odio sem nec elit.</dd>
            <dd>vestibulum id ligula porta felis euismod semper eget iacinia odio sem nec elit.</dd>
            <dt>这里是第二个DT内容给呢</dt>
            <dd>ETIAM PORTA SEM MALESUADA MAGNA MOLLIS EUISMOD.</dd>
        </dl>

        <pre class="pre-scrollable">&lt;p&gt;sample text here....&lt;/p&gt;</pre>

        <table class="table table-striped table-bordered table-hover table-condensed">
            <thead>
                <tr class="info">
                    <th>#First Name</th>
                    <th>#First Name</th>
                    <th>#First Name</th>
                </tr>
            </thead>
            <tbody>
                <tr class="success">
                    <td>mark</td>
                    <td>mark</td>
                    <td>mark</td>
                </tr>
                <tr class="warning">
                    <td>mark</td>
                    <td>mark</td>
                    <td>mark</td>
                </tr>
                <tr>
                    <td>mark</td>
                    <td>mark</td>
                    <td>mark</td>
                </tr>
            </tbody>
        </table>


        <form class="form-inline">
            <fieldset>
                <legend>legend</legend>
                <label>Label name</label>
                <input type="text" placeholder="Type something..." />
                <span class="help-block">Example block-level help text here.</span>
                <label class="checkbox">
                    <input type="checkbox" /> check me out
                </label>
                <button type="submit" class="btn">Submit</button>
            </fieldset>
        </form>

        <form class="form-search">
            <input type="text" class="input-medium search-query" />
            <button type="submit" class="btn btn-primary">Search</button>
        </form>


        <form class="form-horizontal">
            <div class="control-group">
                <label class="control-label" for="inputEmail">Email</label>
                <div class="controls">
                    <input type="text" id="inputEmail" placeholder="Email" />
                </div>
            </div>
            <div class="control-group">
                <label class="control-label" for="inputPassword">Password</label>
                <div class="controls">
                    <input type="password" id="inputPassword" placeholder="Password" />
                </div>
            </div>
            <div class="control-group">
                <div class="controls">
                    <label class="checkbox">
                        <input type="checkbox" />check me
                    </label>
                    <button type="button" class="btn">sign in</button>
                </div>

            </div>
        </form>

    </div>





</body>
</html>
